import React from 'react';
import { history } from 'umi'
import ReactEcharts from '@/components/Echarts';

const TaskPie = ({ data = [], query }) => {
    const finalData = data.map(item => ({ value: item.num, name: item.name }));

    const handleChartClick = ({ name }) => {
        const map = { 正常: 1, 不足: 2, 超额: 3 };
        history.push({
            pathname: '/stat/workStat/workOverview/work/employee',
            query: { ...query, workloadFlag: map[name] }
        });
    };

    return (
        <ReactEcharts
            onEvents={{ click: handleChartClick }}
            option={{
                color: ['#FFA808', '#597EF7', '#4DCB73'],
                tooltip: {
                    trigger: 'item',
                    formatter: '{a} <br/>{b}: {c} ({d}%)'
                },
                series: [
                    {
                        name: '工作量分析',
                        type: 'pie',
                        radius: '65%',
                        // label: {
                        //     formatter: '{b}: {c} 人，{d}%'
                        // },
                        itemStyle: {
                            normal: {
                                borderWidth: 4,
                                borderColor: '#ffffff'
                            },
                            emphasis: {
                                borderWidth: 0,
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.1)'
                            }
                        },
                        data: finalData
                    }
                ]
            }}
        />
    );
};

export default TaskPie;
